<!-- 简单二次封装输入框解决输入卡顿问题 -->
<template>
  <el-input
    v-model="input"
    :type="type"
    :placeholder="placeholder"
    clearable
    v-bind="$attrs"
    @change="inputChange"
    @keyup.enter="inputChange"
    @clear="clear"
  />
</template>
<script>
export default {
  props: {
    type: {
      type: String,
      default: 'text'
    },
    value: {
      type: [String, Number],
      default() {
        return ''
      }
    },
    placeholder: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      input: this.value
    }
  },
  watch: {
    value: {
      handler(val) {
        this.input = val
      },
      deep: true
    }
  },
  methods: {
    inputChange(value) {
      this.$emit('input', this.input)
    },
    clear() {
      this.$emit('input', '')
    }
  }
}
</script>
